<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    
</body>
<script>

    // const obj = {
    //     _name:"admin"
    // };
    // Object.defineProperty(obj, "name", {
    //     get:function(){
    //         console.log("有人访问了name属性")
    //         return obj._name;
    //     },
    //     set:function(val){
    //         console.log("有人修改了name属性为", val)
    //         obj._name = val;
    //     }
    // })
    // obj.name
    // obj.name = "张三"


    // defineProperty方法和get/set关键字的区别
        // defineProperty可以根据已有对象动态添加访问器和控制器
        // get/set关键字只能在创建对象时添加访问器或控制器

    
    const origin = {
        name:"admin",
        sex:"男",
        age:18
    }

    // 封装拦截器，传入要劫持的对象，返回劫持后的新对象
    function proxy(o){
        const t = {};
        for(let i in o){
            Object.defineProperty(t, i, {
                get(){
                    console.log("有人访问了"+i);
                    return o[i];
                },
                set(val){
                    console.log("有人修改了"+i+"属性为："+val);
                    o[i] = val;
                }
            })
        }
        return t;
    }

    const target = proxy(origin);
    console.log(target);

    target.name = "张三"



    
    
</script>
</html>